<template>
	<!--
    	作者：fuyuan
    	时间：2019-07-18
    	描述：角色
    -->
	<div class="Announcements">
		<div class="Website-visits">
			<div class="location">
				<div class="location-text fl">
					<img class="location-img fl" src="../../images/home/i.png" />
					<p class="fr">角色管理</p>
				</div>
				<img class="biaotibg fl" src="../../images/home/biaotibg.png" />
			</div>
			<div class="search-box">
				<div class="fl">
					<input class="search" id="searchRoleVal" type="text"  placeholder="角色搜索"/>
					<input class="btn" @click="searchRole" type="button" value="查询" />
				</div>
				<div class="fr">
					<!--<router-link to='/addRole/null'>-->
						<div @click="editorRole(null)" class="user-box user-name">新增角色</div>
					<!--</router-link>-->
				</div>

			</div>
			<div class="PressRelease-list">
				<table>
					<thead>
						<tr>
							<th class="table-text-th1">序号</th>
							<th class="table-text-th1">角色</th>
							<th class="table-text-th1">权限</th>
							<th class="table-text-th2">创建日期</th>
							<th class="table-text-th1">授权状态</th>
							<th class="table-text-th3">操作</th>
						</tr>
					</thead>
					<tbody>
						<tr v-for="(model,index) in userData">
							<td>{{index+1}}</td>
							<td>{{model.roleName}}</td>
							<td>{{model.rolePrivs}}</td>
							<td>{{formatData(model.createAt, "yyyy-MM-dd")}}</td>
							<td>
                <input v-if="model.roleStatus == 1" type="button" value="启用" class="delete write" @click="editStatus(model.id,0)" />
                <input v-else type="button" value="冻结" class="delete write" @click="editStatus(model.id,1)" />
              </td>
							<td>
								<input  type="button" value="编辑" class="delete write" @click="editorRole(model.id, model.roleName)" />
<!--								<input type="button" value="删除" class="delete write" @click="deleteRole(model.id)" />-->
								<input type="button" value="查看" class="delete write"  @click="viewRole(model.id,  model.roleName)"/>
							</td>
						</tr>

					</tbody>
				</table>
				<!--total  数据总数   size  一页多少条数据   page  当前页码    changge 返回当前选择的页码  改变一页显示条 child  返回值就是一页显示条数  -->
				<pageination :total="total" :size="size" :page="page" :changge="pageFn" @child="obtainChild"></pageination>
			</div>
		</div>
	</div>
</template>

<script src="./roleList.js"></script>

<style scoped>
	@import "roleList.css";
</style>
